<!doctype html>
<html>
<head>
  <meta charset="utf-8"/>
  <meta http-equiv="X-UA-Compatible" content="IE=7; IE=EmulateIE9; IE=10" />
  <meta name="keywords" content="displayPlaceData" />
  <title>HERE Maps API Example: Displaying Place Details</title>
  <!-- Set up constants such as APP ID and token -->
  <script type="text/javascript" src="libs/hereAppIdAndToken.js"></script>
  <!-- Bootstrap jQuery Library -->
  <script type="text/javascript" src="libs/jQl.min.js"></script>
  <!-- Asynchronously the HERE Maps API for JavaScript -->
  <script type="text/javascript" src="libs/hereAsyncLoader.js"
    id="HereMapsLoaderScript"
    data-params="maps,places"
    data-callback="displayPlaceData" >
  </script>
  <link rel="icon" href="http://here.com/favicon.ico"/>
  <!--<link href="http://developer.here.com/html/css/main.css" rel="stylesheet" />-->
</head>
<body>
  <h1>Displaying Place Details</h1>
  <p>This example shows the details of a place obtained from the HERE place data.</p>
  <p>
  The place Id was: <a href="http://m.nokia.me/p?pid=276u33d8-e8ea92be93e04b8b9c4ca440bd1a27a2">
  276u33d8-e8ea92be93e04b8b9c4ca440bd1a27a2</a></p>
  <div id="placeContainer" style="width:540px; height:334px;"></div>
<script id="example-code" data-categories="place" type="text/javascript" >
//<![CDATA[
function displayPlaceData(map) {
  var basicPlace = new nokia.places.widgets.Place({
    placeId: '276u33d8-e8ea92be93e04b8b9c4ca440bd1a27a2',
    targetNode: 'placeContainer',
    template: 'nokia.blue.extended'});
}
//]]>
</script>
<script type="text/javascript" src="libs/prettyprint.js"></script>
</body>
</html>